<script lang="ts" setup>
// vue
import { ref, defineEmits, watchEffect, defineProps } from 'vue'
const emits = defineEmits(['onChange'])
defineProps<{ title?: string }>()
const text = ref<string>('')
watchEffect(() => {
  emits("onChange", text.value)
})
</script>
<template>
  <div class="text">
    <div class="title" v-if="title">
      {{ title }}
    </div>
    <textarea placeholder="请详细描述您的病情" v-model="text"></textarea>
  </div>
</template>
<style lang="scss" scoped>
.text {
  width: 100%;

  .title {
    font-size: 18px;
  }

  textarea {
    width: 100%;
    min-height: 90px;
    border: none;
    font-size: 15px;
    padding: 0;
    padding: 10px 0;
  }

  textarea::placeholder {
    color: #cccccc;
  }
}
</style>
